<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>修改光速洗车商户</title>
    <style>
        .wu-m5>input{
            margin-bottom: 5px;
        }
    </style>
</head>
<body>
<div class="pos-r">
    <nav class="breadcrumb"><i class="Hui-iconfont">&#xe67f;</i> 首页
        <span class="c-gray en">&gt;</span>
        光速洗车
        <span class="c-gray en">&gt;</span>
        商户配置
        <span class="c-gray en">&gt;</span>
        修改光速洗车商户
    </nav>
    <div>
        <div class="page-container">
            <form action="" method="get" class="form form-horizontal" id="edit-form-auto">
                <div class="form-unit">基本信息</div>
                <input style="display: none;" id="edit-userNames-auto"/>
                <input style="display: none;" id="edit-bizId-auto" name="bizId"/>
                <div class="form-group">
                    <label class="control-label col-xs-4 col-sm-3"><span class="c-red"></span>商户名称：</label>
                    <div class="formControls col-xs-4 col-sm-4">
                        <input type="text" class="form-control" value="" placeholder="必填项" id="edit-autoNames" name="bizName">
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label col-xs-4 col-sm-3"><span class="c-red"></span>商户类别：</label>
                    <div class="formControls col-xs-4 col-sm-4 skin-minimal">
                        <div class="radio-box">
                            <input type="radio" id="edit-autotype-1" name="bizType" value="0" checked>
                            <label for="edit-autotype-1">加盟店</label>
                        </div>
                        <div class="radio-box">
                            <input type="radio" id="edit-autotype-2" name="bizType" value="1">
                            <label for="edit-autotype-2">直营店</label>
                        </div>
                        <div class="radio-box">
                            <input type="radio" id="edit-autotype-3" name="bizType" value="2"/>
                            <label for="edit-autotype-3">其他</label>
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label col-xs-4 col-sm-3"><span class="c-red"></span>商户状态：</label>
                    <div class="formControls col-xs-4 col-sm-4 skin-minimal">
                        <div class="radio-box">
                            <input type="radio" id="edit-autostate-1" name="bizState" value="0" checked>
                            <label for="edit-autostate-1">开启</label>&nbsp;&nbsp;&nbsp;&nbsp;
                        </div>
                        <div class="radio-box">
                            <input type="radio" id="edit-autostate-2" name="bizState" value="1">
                            <label for="edit-autostate-2">禁用</label>
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label col-xs-4 col-sm-3"><span class="c-red"></span>联系电话：</label>
                    <div class="formControls col-xs-4 col-sm-4">
                        <input type="text" class="form-control" value="" placeholder="必填项" id="edit-autophones" name="phone">
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label col-xs-4 col-sm-3"><span class="c-red"></span>商户账号：</label>
                    <div class="formControls col-xs-4 col-sm-4">
                        <input type="text" class="form-control" placeholder="必填项" name="userNames" id="edit-autouserNames" value="">
                    </div>
                    <span id="edit-autousernameSpan"></span>
                </div>
                <div class="form-group">
                    <label class="control-label col-xs-4 col-sm-3"><span class="c-red"></span>商户密码：</label>
                    <div class="formControls col-xs-4 col-sm-4">
                        <input type="password" class="form-control" placeholder="不修改无需填写" name="password" id="edit-autopasswords">
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label col-xs-4 col-sm-3"><span class="c-red"></span>角色：</label>
                    <div class="formControls col-xs-4 col-sm-4">
                        <input type="text" class="form-control" placeholder="" name="roleId" id="edit-autoroleIds">
                    </div>
                </div>


                <div class="form-unit">其他信息</div>
                <div class="form-group">
                    <label class="control-label col-xs-4 col-sm-3"><span class="c-red"></span>联系地址：</label>
                    <div class="formControls col-xs-4 col-sm-4">
                        <input type="text" class="form-control" placeholder="" name="address" id="edit-autoaddresss">
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label col-xs-4 col-sm-3">商户描述：</label>
                    <div class="formControls col-xs-4 col-sm-4">
                        <textarea id="edit-autobizDesc" name="bizDesc" cols="60" rows="5" class="textarea valid" placeholder="请输入商户的描述..."></textarea>
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-xs-8 col-sm-9 col-xs-offset-4 col-sm-offset-3">
                        <input onclick="platformMerchantAutowashEditFun.submitAction();return false;" class="btn btn-primary radius" value="&nbsp;&nbsp;提交&nbsp;&nbsp;"/>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>
<script type="text/javascript">
    //商户管理，添加服务
    var platformMerchantAutowashEditFun;

    var extDataEdit;

    $(function () {
        //加载人名
        $.ajax({
            type: "GET",
            url: "biz/getBizUser",
            dataType: "json",
            success: function (data) {
                $("#edit-sysUserIds").select2({
                    data: data,
                    placeholder: '请选择',
                    allowClear: true
                })
            },
            error: function () {
                alert("error");
            }
        });

        //加载角色
        $.ajax({
            type: "GET",
            url: "menu/getBizRoles",
            dataType: "json",
            success: function (data) {
                $("#edit-autoroleIds").select2({
                    data: data,
                    placeholder: '请选择',
                    allowClear: true
                })
                $('#edit-autoroleIds').on('select2:select', function (e) {
                    $(e.target).siblings('I').removeClass('glyphicon glyphicon-remove').addClass('glyphicon glyphicon-ok').show().siblings('SMALL').hide().parents('.form-group').removeClass('has-error').addClass('has-success')
                });
                $('#edit-autoroleIds').on('select2:unselect', function (e) {
                    $(e.target).siblings('I').removeClass('glyphicon glyphicon-ok').addClass('glyphicon glyphicon-remove').show().siblings('SMALL').show().parents('.form-group').removeClass('has-success').addClass('has-error')
                });
            },
            error: function () {
                alert("error");
            }
        });
    });

    platformMerchantAutowashEditFun = {
        init: function () {
            let _this = this;
            var bizId = sessionStorage.getItem("merchant-bizId");
            _this.modify_array(bizId);
            _this.bootstrapvalidatorForm();

        },
        //修改，查询单条
        modify_array: function (index) {
            var _this = this;

            $.ajax({
                type: "get",
                url: "biz/getBizTenant",
                async: false,
                data: {bizId: index},
                dataType: "json",
                success: function (result) {
                    if (result.state) {
                        var data = result.data;
                        $("#edit-autoNames").val(data.bizName);
                        $("#edit-autophones").val(data.phone);
                        $("#edit-autoaddresss").val(data.address);
                        $("#edit-autouserNames").val(data.userName);
                        $("#edit-userNames-auto").val(data.userName);
                        $("#edit-autobizDesc").val(data.bizDesc);
                        $("#edit-bizId-auto").val(data.bizId);
                        var biz_type = data.bizType;
                        $("#edit-autotype-" + (biz_type + 1)).prop("checked", true);
                        var state = data.bizState;
                        $("#edit-autostate-" + (state + 1)).prop("checked", true);
                        var ddd = $("#edit-sysUserIds").select2();    //获取selectid
                        ddd.val(data.sysUserId).trigger("change");    //设置 value 为four的 option 为选中状态
                        var ddds = $("#edit-autoroleIds").select2();    //获取selectid
                        ddds.val(data.roleId).trigger("change");    //设置 value 为four的 option 为选中状态

                        $("#editMerImg").fileinput("clear");
                        var resList = data.imgList;
                        if (resList != null) {
                            var len = resList.length;
                            var width = "85px";
                            if (len == 1) {
                                width = "160px";
                            }
                            var img = new Array();
                            for (var i = 0; i < len; i++) {
                                img.push("<img src='files" + resList[i]["url"] + "' eid='" + resList[i]["urlId"] + "' class='file-preview-image' style='width:" + width + ";height:" + width + ";' onclick='window.open(this.src)'>");
                            }
                            $("#editMerImg").fileinput("refresh", {initialPreview: ""});//必加多个资源有重复图片
                            $("#editMerImg").fileinput("refresh", {initialPreview: img});
                            $("#edit-form-auto").find(".file-thumbnail-footer").remove();
                            $("#edit-form-auto").find(".file-drop-zone-title").remove();
                            $("#edit-form-auto").find(".file-preview-frame").css("height", "100px");
                        }
                    }
                    else {
                        alert(result.message);
                    }
                },
                error: function () {
                    alert("error");
                }
            });
        },
        //验证用户名是否存在
        usernameCheck: function (par) {
            if($("#edit-userNames-auto").val() == par){
                $("#edit-autousernameSpan").text("该商户账号可使用！");
                $("#edit-autousernameSpan").css("color", "green");
                return;
            }
            $.ajax({
                type: "GET",
                url: "biz/checkTenantName",
                data: {userName: par},
                dataType: "json",
                success: function (data) {
                    $("#edit-autousernameSpan").text(data.message);
                    if (data.state) {
                        $("#edit-autousernameSpan").css("color", "green");
                    } else {
                        $("#edit-autousernameSpan").css("color", "red");
                    }
                },
                error: function () {
                    alert("error");
                }
            });
        },
        //表单提交
        submitAction: function () {
            //bootstrap验证
            let bootstrapValidator = $("#edit-form-auto").data('bootstrapValidator');
            bootstrapValidator.validate();
            if(bootstrapValidator.isValid())
                $("#edit-form-auto").submit();
            else return;



            //提交
            $.ajax({
                type: "GET",
                url: "biz/modifyAutoWashTenant",
                data: $("#edit-form-auto").serialize(),
                dataType: "json",
                success: function (data) {
                    if (data.state) {
                        layer.msg(data.message, {icon: 1});
                        //关闭窗口
                        removeIframe();
                        platformMerchantAutoFun.searchAction();
                    } else {
                        alert(data.message);
                    }
                },
                error: function () {
                    alert("error");
                }
            });
        },

        //bootstrap验证
        bootstrapvalidatorForm: function () {
            $('#edit-form-auto').bootstrapValidator({
                message: 'This value is not valid',
                excluded : [':disabled'],
                feedbackIcons: {
                    valid: 'glyphicon glyphicon-ok',
                    invalid: 'glyphicon glyphicon-remove',
                    validating: 'glyphicon glyphicon-refresh'
                },
                fields: {
                    bizName: {
                        validators: {
                            notEmpty: {
                                message: '商户名称不能为空'
                            },
                            stringLength: {
                                min: 2,
                                max: 100,
                                message: '商户名称长度必须在2到100位之间'
                            }
                        }
                    },
                    phone: {
                        validators: {
                            notEmpty: {
                                message: '联系电话不能为空'
                            },
                            regexp: {
                                regexp: /^(\(\d{3,4}\)|\d{3,4}-|\s)?\d{7,14}$/,
                                message: '联系电话格式不正确'
                            }
                        }
                    },
                    userNames: {
                        validators: {
                            notEmpty: {
                                message: '商户账号不能为空'
                            },
                            stringLength: {
                                min: 4,
                                max: 50,
                                message: '商户账号长度必须在4到50位之间'
                            },
                            threshold:4,
                            remote:{
                                url:"biz/checkTenantName",
                                data:{userNameHide:$('#edit-userNames-auto').val()},
                                message: "该商户账号已存在",
                                delay: 2000,
                                type:"GET"
                            }
                        }
                    },
                    password: {
                        validators: {
                            stringLength: {
                                min: 6,
                                max: 32,
                                message: '商户密码长度必须在6到32位之间'
                            }
                        }
                    },
                    roleId: {
                        validators: {
                            notEmpty: {
                                message: '角色不能为空'
                            }
                        }
                    },
                    wu1: {
                        validators: {
                            notEmpty: {
                                message: '洗车提成不能为空'
                            },
                            regexp: {
                                regexp: /^([1-9]\d?(\.\d{1,2})?|0\.\d{1,2}|100)$/,
                                message: '洗车提成格式不正确'
                            }
                        }
                    },
                    wu2: {
                        validators: {
                            notEmpty: {
                                message: '美容提成不能为空'
                            },
                            regexp: {
                                regexp: /^([1-9]\d?(\.\d{1,2})?|0\.\d{1,2}|100)$/,
                                message: '美容提成格式不正确'
                            }
                        }
                    },
                    wu3: {
                        validators: {
                            notEmpty: {
                                message: '保养提成不能为空'
                            },
                            regexp: {
                                regexp: /^([1-9]\d?(\.\d{1,2})?|0\.\d{1,2}|100)$/,
                                message: '保养提成格式不正确'
                            }
                        }
                    },
                    wu4: {
                        validators: {
                            notEmpty: {
                                message: '维修提成不能为空'
                            },
                            regexp: {
                                regexp: /^([1-9]\d?(\.\d{1,2})?|0\.\d{1,2}|100)$/,
                                message: '维修提成格式不正确'
                            }
                        }
                    }
                }
            });
        }
    };

    platformMerchantAutowashEditFun.init();

    $("#editMerImg").fileinput({
        language: "zh", //设置语言
        uploadUrl: "file/upload", //上传的地址
        allowedFileExtensions: ["jpg", "png", "gif"],//接收的文件后缀
        maxFileCount: 5,
        showUpload: false,//是否显示上传按钮
        showRemove: false,//是否显示删除按钮
        showCaption: true,//是否显示输入框
        browseClass: "btn btn-primary", //按钮样式
        enctype: "multipart/form-data",
        showPreview: true,
        previewFileIcon: "<i class='fa fa-file'></i>",
        maxSize: 1024,//单位kb
        uploadAsync: false,//多图片一次上传
        allowedPreviewTypes: ["image"],
        uploadExtraData: function () {
            return extData;
        }
    }).on("fileuploaded", function (event, data) {
        // if (data.response.success == 0) {
        //     base.success("修改成功！");
        //     base.closeTab("修改商品");
        // }
        // else {
        //     base.error("修改成功，图片上传失败");
        // }
    }).on("change", function (event) {
        isChange = true;
    }).on("fileloaded", function () {
        // $("#edit-form-auto").find(".file-thumbnail-footer").remove();
        // $("#edit-form-auto").find(".file-drop-zone-title").remove();
    });

</script>
</body>
</html>